<template>
  <div>
    <el-dialog title="用户机构调动" :visible.sync="isShow" width="1000px" :close-on-click-modal="false" @close="closeDialog"
      @open="openDialog">
      <div v-loading="loading">
        <el-card>
          <el-form size="mini" ref="newUserDate" :model="newUserDate" :rules="rules" inline label-width="120px"
            label-position="left">
            <el-row :gutter="10">
              <el-col :span="12">
                <el-form-item prop="userNum" label="用户号:">
                  <el-input v-model="newUserDate.userNum" :disabled="true" placeholder="请输入用户号"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item prop="userName" label="用户名称:">
                  <el-input v-model="newUserDate.userName" :disabled="true" placeholder="请输入用户名称"></el-input>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="10">
              <el-col :span="12">
                <el-form-item prop="branchId" label="现属机构:">
                  <el-select v-model="newUserDate.branchId" :disabled="true">
                    <el-option v-for="item in brnoList" :key="item.value" :label="item.orgno+'-'+item.cname" :value="item.orgno"
                      :disabled="item.disabled">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
            <el-row :gutter="10">
              <el-col :span="12" >
                <el-form-item prop="toBranchid" label="调动机构:">
                  <el-select v-model="newUserDate.toBranchid" filterable>
                    <el-option v-for="item in brnoList" 
                    :key="item.value" 
                    :label="item.cname" :value="item.orgno"
                      :disabled="item.disabled">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-row>
          </el-form>
        </el-card>
        <div style="text-align:right;margin:20px 0">
          <el-button size="mini" @click="cancleDialog">取消</el-button>
          <el-button type="primary" @click="commit" size="mini">确认</el-button>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
  import branchList from "@/message/shared/branch-list";
  import userBranchChang from "@/message/userManage/user/userbranch-chang";
  import request from "@/common/utils/request";
  import toolBox from "@/common/utils/toolBox";

  export default {
    name: "create-user",
    data() {
      //表单自定义校验
      return {
        loading: false,
        brnoList: [],
        newUserDate: { //表单信息
          userNum: "",
          userName: "",
          branchId: "",
          toBranchid: ""
        },
        rules: { //表单校验规则
          toBranchid: [{
            required: true,
            message: "请选择机构号",
            trigger: "change"
          }
          ]
        }
      };
    },
    props: { //父元素传递的数据
      optionUpdate: Object
    },
    computed: {
      isShow: { //修改用户弹窗是否显示
        get: function () {
          return this.optionUpdate.isShow;
        },
        set: function (newValue) {
          this.optionUpdate.isShow = newValue;
        }
      },
    },
    methods: {
      initList() { //初始化下拉列表
        let resBody = new branchList();
        resBody.data.orgno = this.$store.getters.BranchNum;
        request(resBody)
          .then(response => {
            this.loading = false;
            this.brnoList = response.RspInfo.Result;
          })
          .catch(error => {
            this.loading = false
            console.error("错误信息", error);
          });
      },
      userInfoLoad() {
        console.log(this.optionUpdate.currentRow)
        this.newUserDate.userNum= this.optionUpdate.currentRow.UserNum;
        this.newUserDate.userName= this.optionUpdate.currentRow.UserName;
        this.newUserDate.branchId= this.optionUpdate.currentRow.BranchNum;
      },
      openDialog() { //打开弹窗事件
        this.loading = true;
        this.initList();
        this.userInfoLoad();
        this.loading = false;
      },
      cancleDialog() { //关闭弹窗事件，清楚表单验证
        this.optionUpdate.isShow = false;
        this.$refs.newUserDate.clearValidate();
      },
      closeDialog() { //弹窗关闭
        this.$refs.newUserDate.clearValidate();
      },
      formatTime() {
          const time = new Date()
          var h = String(time.getHours());
          var m = String(time.getMinutes());
          var s = String(time.getSeconds());
          var S = String(time.getMilliseconds());
          h = h.length < 2 ? '0' + h : h;
          m = m.length < 2 ? '0' + m : m;
          s = s.length < 2 ? '0' + s : s;
          S = S.length < 3 ? (S.length < 2? '00' + S : '0' + S): S;
          return h + m + s + S
      },
      commit() { //修改机构
        this.$refs["newUserDate"].validate(valid => {
          if (valid) {
            this.loading = true;
            console.log("121313")
            let resBody = new userBranchChang();
            resBody.data.UserNum = this.newUserDate.userNum;
            resBody.data.UserName = this.newUserDate.userName;
            resBody.data.OrigOrgNum = this.newUserDate.branchId;
            resBody.data.TargetOrgNum = this.newUserDate.toBranchid;
            resBody.data.DateTran = toolBox.getNowTime(0);
            resBody.data.TimeTran = this.formatTime();
            request(resBody)
              .then(response => {
                if (response.SYS_HEAD.ReturnCode === "000000") {
                  this.loading = false;
                  this.$message({
                    type: "success",
                    message: "机构调动成功!"
                  });
                  this.optionUpdate.isShow = false;
                  this.$emit("refreshTable"); //修改用户成功并刷新表格数据
                } else {
                    this.$message({
                      type: "error",
                    message: response.SYS_HEAD.ReturnMessage
                  });
                  this.loading = false;
                }
              })
              .catch(error => {
                this.loading = false;
              });
          } else {
            this.$message({
              type: "warning",
              message: "请输入合法的数据！"
            });
            return false;
          }
        });
      }
    }
  };

</script>

<style lang="scss" scoped>
  .content {
    display: flex;
    flex-direction: column;
  }

  .require {
    color: red;
  }

  .dialog-text {
    display: inline-block;
    width: 100%;
    text-align: center;
    color: red;
    font-size: 18px;
  }

  .role {
    width: 95%;
    border: 1px solid #eee;
    border-radius: 4px;
    height: 290px;

    .roleHeader {
      color: #606266;
      font-weight: 500;
      font-size: 14px;
      background: #f5f7fa;
      height: 42px;
      box-sizing: border-box;
      padding: 9px;
      overflow-y: auto;
    }
  }

  .el-dialog__body {
    padding: 20px;
    padding-top: 10px;
  }

  .el-card {
    overflow: inherit;
  }

</style>
